<template>
	<view class="vehicle-management">
		<!-- 车辆管理 -->
		<u-navbar leftIconSize="34rpx" autoBack :placeholder="true" bgColor="#ffffff">
			<view class="" slot="center">
				<text class="c-000 pf-sc fw-600" style="font-size: 34rpx;">车辆管理</text>
			</view>
		</u-navbar>
		<view
			class="set-data-container w-750 b-box d-flex flex-c ali-i-c  bg-fa po-re"
			style="padding:20rpx 24rpx 0;"
			:style="{ height: containerHeight }"
		>
			<view
				class="w-100 b-box bg-ff d-flex flex-r ali-i-c just-sw"
				v-for="(item, index) of CarList"
				:key="item.id"
				style="border-radius: 16rpx;overflow: hidden;height: 208rpx;padding: 34rpx 34rpx 30rpx 36rpx;margin-bottom: 20rpx; "
			>
				<view class="d-flex flex-c ali-i-s just-s b-box">
					<view class="d-flex felx-r ali-i-c just-s" style="margin-bottom: 8rpx;">
						<u-badge
							v-if="item.isdefult == 1"
							:customStyle="{ marginRight: '8rpx', borderRadius: '6rpx' }"
							type="warning "
							bgColor="#ED1D15"
							color="#ffffff"
							shape="horn"
							max="1"
							value="默认"
						></u-badge>
						<text class="pf-sc fw-500 c-000" style="font-size: 34rpx;">{{ item.carno }}</text>
					</view>
					<view style="margin-bottom: 10rpx;">
						<text class="pf-sc fw-400 c-333" style="font-size: 30rpx;">
							{{ item.carcolor }}/{{ item.cartype }}
						</text>
					</view>
					<view>
						<text class="pf-sc fw-400 c-333" style="font-size: 30rpx;">
							{{ item.name }}/{{ item.mobile }}
						</text>
					</view>
				</view>
				<view style="width: 50rpx;height: 50rpx;" @click="GoAddCarInfo(4, item)">
					<image :src="require('../static/bj.png')" style="width: 40rpx;height: 40rpx;"></image>
				</view>
			</view>
			<!-- btn -->
			<view class="d-flex flex-r ali-i-c just-c b-box w-100" style="margin-top: 40rpx;">
				<u-button
					:throttleTime="700"
					@click="GoAddCarInfo(2)"
					plain
					:customStyle="{
						height: '88rpx',
						width: '670rpx',
						font: '500 32rpx PingFang SC',
						color: '#26387C',
						border: '2rpx solid #26387C',
						borderRadius: '44rpx'
					}"
					shape="square"
					text="新增车辆"
				></u-button>
			</view>
		</view>
	</view>
</template>

<script>
import { getcarlist } from '@/common/api.js';
import { _containerHeight } from '@/utils/GetSys.js';
import Unavbar from '../components/uview-ui/components/u-navbar/u-navbar';
import Ubutton from '../components/uview-ui/components/u-button/u-button';
import uBadge from '../components/uview-ui/components/u-badge/u-badge';
export default {
	components: {
		'u-navbar': Unavbar,
		'u-button': Ubutton,
		'u-badge': uBadge
	},
	data() {
		return {
			containerHeight: '',
			CarList: []
		};
	},
	methods: {
		GoAddCarInfo(type, item) {
			//跳转到新增车辆页面
			// console.log(index,type);
			//index:  通过地址id修改地址信息，如果index为false则视为新增地址
			if (type == 4) {
				//等于4的时候为编辑车辆  保存当前车辆的信息 另一个页面展示
				uni.navigateTo({
					url: `/userModelA/userB/AddCarInfo/AddCarInfo?type=${type}&id=${item.id}`
				});
				uni. setStorageSync('car',item)
			}
			if (type == 2) {
				uni.navigateTo({
					url: `/userModelA/userB/AddCarInfo/AddCarInfo?type=${type}`
				});
				uni.removeStorageSync('car')
			}
		}
	},
	onLoad(options) {
		this.containerHeight = _containerHeight();
	},
	onShow() {
		//页面加载发送请求渲染车辆列表
		let params = {
			token: uni.getStorageSync('usertoken'),
			type: 1
		};
		getcarlist(params).then(res => {
			console.log(res);
			this.CarList = res.data.data;
		});
	}
};
</script>

<style lang="scss">
.vehicle-management {
}
</style>
